Project Overview

**Referenced Files in This Document** - [README.md](file://README.md) - [package.json](file://package.json) - [.eleventy.js](file://.eleventy.js) - [worker.js](file://worker.js) - [wrangler.jsonc](file://wrangler.jsonc) - [cloudflare-pages.toml](file://cloudflare-pages.toml) - [src/_includes/layouts/base.njk](file://src/_includes/layouts/base.njk) - [src/_includes/layouts/iaa-base.njk](file://src/_includes/layouts/iaa-base.njk) - [src/admin/config.yml](file://src/admin/config.yml) - [src/alliance-login.njk](file://src/alliance-login.njk) - [src/_data/site.json](file://src/_data/site.json) - [src/assets/js/main.js](file://src/assets/js/main.js) - [src/assets/js/modules/carousel-system.js](file://src/assets/js/modules/carousel-system.js) - [src/assets/js/modules/search-functionality.js](file://src/assets/js/modules/search-functionality.js)

Introduction

Ace Strategies Prime is an integrated digital platform for an Australian government relations, stakeholder engagement, and strategic communications firm. The platform serves two primary audiences:

Public website visitors accessing marketing, news, and service content
Invest Australia Alliance (IAA) members through a secure member portal

The platform combines modern static site generation with serverless runtime capabilities to deliver a fast, responsive, and secure experience. It leverages Eleventy for content processing, Cloudflare Workers for authentication and APIs, Sveltia CMS for content management, and Pagefind for client-side search.

Project Structure

The repository follows a clear separation of concerns with Eleventy as the static site generator and Cloudflare Workers handling dynamic functionality:

graph TB
subgraph "Source Layer"
SRC[src/]
DATA[_data/]
INCLUDES[_includes/]
ASSETS[assets/]
CONTENT[content/]
ADMIN[admin/]
end
subgraph "Build Pipeline"
ELEVENTY[Eleventy 3]
PAGEFIND[Pagefind Indexer]
WRANGLER[Wrangler CLI]
end
subgraph "Runtime Layer"
WORKER[Cloudflare Worker]
KV[Cloudflare KV]
RESSEND[Resend API]
SHEETS[Google Sheets API]
end
subgraph "Output"
SITE[_site/]
CMS[Admin Interface]
end
SRC --> ELEVENTY
DATA --> ELEVENTY
INCLUDES --> ELEVENTY
ASSETS --> ELEVENTY
CONTENT --> ELEVENTY
ADMIN --> ELEVENTY
ELEVENTY --> SITE
PAGEFIND --> SITE
WRANGLER --> WORKER
WORKER --> KV
WORKER --> RESSEND
WORKER --> SHEETS
WORKER --> SITE
SITE --> CMS

Diagram sources

[README.md:80-156](file://README.md#L80-L156)
[package.json:5-13](file://package.json#L5-L13)
[wrangler.jsonc:1-35](file://wrangler.jsonc#L1-L35)

Section sources

[README.md:80-156](file://README.md#L80-L156)
[package.json:1-32](file://package.json#L1-L32)

Core Components

The platform consists of several interconnected components that work together to deliver a seamless user experience:

Static Site Generation (Eleventy)

Purpose: Processes Nunjucks templates and Markdown content into static HTML
Features:
- Global data injection via _data/ files
- Custom filters and shortcodes for content manipulation
- Transform pipeline for Obsidian syntax conversion
- Passthrough copying for assets and admin interface

Serverless Runtime (Cloudflare Worker)

Purpose: Handles member authentication, OAuth, and API endpoints
Key Functions:
- Magic link authentication for IAA members
- Polling data API from Google Sheets
- CORS handling for CMS integration
- Static asset delivery via Cloudflare Assets

Content Management (Sveltia CMS)

Git-backed CMS with GitHub integration
Collections: News, Cases, Team, Knowledge Base, Newsletters
Settings Management: Site configuration, page content, and resource management
Security: OAuth proxy eliminates server-side credential storage

Search Infrastructure (Pagefind)

Client-side indexing during build process
Instant search with debounced queries
Category-aware results with Material Icons
Keyboard navigation support

Section sources

[README.md:33-44](file://README.md#L33-L44)
[.eleventy.js:1-283](file://.eleventy.js#L1-L283)
[worker.js:1-321](file://worker.js#L1-L321)

Architecture Overview

The platform employs a hybrid architecture combining static site generation with serverless runtime capabilities:

sequenceDiagram
participant Visitor as "Website Visitor"
participant Worker as "Cloudflare Worker"
participant KV as "Cloudflare KV"
participant Resend as "Resend API"
participant Sheets as "Google Sheets API"
participant Site as "Static Assets"
Note over Visitor,Site : Public Website Access
Visitor->>Site : Request public page
Site-->>Visitor : Serve static HTML/CSS/JS
Note over Visitor,Worker : Member Portal Access
Visitor->>Worker : Request /alliance/members/*
Worker->>Worker : Check ace_member_session cookie
alt Valid session
Worker->>Site : Fetch static page
Site-->>Visitor : Serve member content
else No/invalid session
Worker-->>Visitor : Redirect to /alliance/login/?next=original
end
Note over Visitor,Resend : Magic Link Authentication
Visitor->>Worker : POST /alliance/login/
Worker->>KV : Check MEMBER_EMAILS
alt Approved member
Worker->>Resend : Send magic link email
Resend-->>Worker : Confirmation
Worker-->>Visitor : Redirect with success message
else Not approved
Worker-->>Visitor : Silent no-op (prevent enumeration)
end
Note over Visitor,Sheets : API Access
Visitor->>Worker : GET /api/polling.json
Worker->>Sheets : Fetch polling data
Sheets-->>Worker : Return JSON data
Worker-->>Visitor : Serve cached polling data

Diagram sources

[worker.js:77-321](file://worker.js#L77-L321)
[README.md:425-477](file://README.md#L425-L477)

The architecture ensures optimal performance through static delivery while maintaining security and dynamic functionality through serverless processing.

Section sources

[README.md:523-587](file://README.md#L523-L587)
[worker.js:297-321](file://worker.js#L297-L321)

Detailed Component Analysis

Member Authentication System

The IAA member portal implements a secure magic link authentication flow:

flowchart TD
A["User visits /alliance/members/*"] --> B["Worker reads ace_member_session cookie"]
B --> C{"Valid session?"}
C --> |Yes| D["Serve requested page"]
C --> |No| E["Redirect to /alliance/login/?next={original}"]
F["User submits email on /alliance/login/"] --> G["Check MEMBER_EMAILS KV"]
G --> H{"Approved member?"}
H --> |No| I["Silent no-op (prevent enumeration)"]
H --> |Yes| J["Generate 32-byte random token"]
J --> K["Store in MAGIC_TOKENS KV (900s TTL)"]
K --> L["Send magic link email via Resend"]
L --> M["Redirect to /alliance/login/?sent=1"]
N["User clicks magic link"] --> O{"Token valid?"}
O --> |No| P["Redirect to /alliance/login/?error=expired"]
O --> |Yes| Q["Create session token (30-day expiry)"]
Q --> R["Set HttpOnly Secure SameSite=Lax cookie"]
R --> S["Redirect to /alliance/members/"]
T["GET /alliance/logout/"] --> U["Clear session cookie"]
U --> V["Redirect to /alliance/login/"]

Diagram sources

[worker.js:77-295](file://worker.js#L77-L295)
[README.md:425-477](file://README.md#L425-L477)

Key security features include:

Session management: HMAC-SHA256 signed tokens with constant-time verification
Magic link protection: 15-minute TTL with one-time use enforcement
Enumeration prevention: Silent failure for non-approved emails
Cookie security: HttpOnly, Secure, SameSite=Lax flags

Section sources

[worker.js:12-58](file://worker.js#L12-L58)
[worker.js:94-147](file://worker.js#L94-L147)
[worker.js:150-177](file://worker.js#L150-L177)
[worker.js:278-295](file://worker.js#L278-L295)

Content Management Workflow

The Sveltia CMS provides a Git-backed content management system:

classDiagram
class CMS {
+collections : News, Cases, Team, Knowledge
+settings : Site configuration
+media : Image uploads
+authentication : GitHub OAuth
}
class Collections {
+news : Markdown with frontmatter
+cases : Case study content
+team : Team member profiles
+knowledge : Member-only articles
+newsletters : Archive entries
}
class Settings {
+site.json : Global configuration
+pages.json : Page-specific content
+capabilities.json : Service offerings
+resources.json : Member downloads
}
class DataFiles {
+testimonials.json : Homepage carousel
+clients.json : Client logos
+iaaPartners.json : Alliance partners
+affiliations.json : Professional groups
}
CMS --> Collections : manages
CMS --> Settings : configures
CMS --> DataFiles : maintains

Diagram sources

[src/admin/config.yml:11-774](file://src/admin/config.yml#L11-L774)
[README.md:174-204](file://README.md#L174-L204)

The CMS supports:

Multiple content types: Structured content with validation
Media management: Centralized image storage and upload
Version control: Automatic Git commits for all changes
Preview workflow: Changes trigger automatic rebuilds

Section sources

[src/admin/config.yml:1-774](file://src/admin/config.yml#L1-L774)
[README.md:174-204](file://README.md#L174-L204)

Interactive Features and Components

Carousel System

The platform implements responsive carousels for capabilities, testimonials, and news content:

flowchart TD
A["initCarousels()"] --> B["setupCarousel(config)"]
B --> C["Calculate items per page"]
C --> D["Render pagination dots"]
D --> E["Bind navigation events"]
E --> F["Handle scroll events"]
F --> G["Update active dot state"]
G --> H["Keyboard navigation support"]
H --> I["Drag-to-scroll functionality"]
J["Viewport scroll"] --> K["Update button opacity"]
K --> L["Smooth scrolling behavior"]
L --> M["Responsive resize handling"]

Diagram sources

[src/assets/js/modules/carousel-system.js:3-169](file://src/assets/js/modules/carousel-system.js#L3-L169)

Key features include:

Adaptive layouts: Responsive item sizing based on viewport
Accessibility: Keyboard navigation and ARIA attributes
Touch support: Drag-to-scroll with momentum
Performance: Efficient DOM manipulation and event handling

Search Functionality

Pagefind-powered client-side search with intelligent categorization:

sequenceDiagram
participant User as "User"
participant Search as "Search Module"
participant Pagefind as "Pagefind Engine"
participant Results as "Results Display"
User->>Search : Open search modal
Search->>Pagefind : Load pagefind.js
User->>Search : Type query (≥2 chars)
Search->>Pagefind : Debounced search(query)
Pagefind-->>Search : Search results
Search->>Results : Render categorized results
User->>Search : Navigate with arrow keys
User->>Search : Press Enter to select
Search->>Results : Redirect to selected page

Diagram sources

[src/assets/js/modules/search-functionality.js:3-179](file://src/assets/js/modules/search-functionality.js#L3-L179)

Advanced features:

Intelligent categorization: Automatic result classification
Excerpt highlighting: Context-aware content previews
Keyboard shortcuts: Modal activation with Ctrl+K
Debounced queries: Optimized performance for typing

Section sources

[src/assets/js/modules/carousel-system.js:1-169](file://src/assets/js/modules/carousel-system.js#L1-L169)
[src/assets/js/modules/search-functionality.js:1-179](file://src/assets/js/modules/search-functionality.js#L1-L179)

Layout Templates and Theming

The platform uses modular layout systems for consistent presentation:

graph LR
subgraph "Base Layout"
BASE[base.njk]
NAV[Navigation]
FOOTER[Footer]
SEARCH[Search Modal]
CURSOR[Custom Cursor]
end
subgraph "IAA Layout"
IAA[iaa-base.njk]
IAA_NAV[IAA Navigation]
IAA_FOOTER[IAA Footer]
IAA_THEME[IAA Theme Toggle]
end
subgraph "Components"
THEME[Theme System]
ANIM[GSAP Animations]
ACCORDION[Accordion System]
CAROUSEL[Carousel System]
end
BASE --> THEME
BASE --> ANIM
BASE --> SEARCH
BASE --> CURSOR
IAA --> THEME
IAA --> ANIM
IAA --> IAA_THEME
BASE --> CAROUSEL
BASE --> ACCORDION
IAA --> CAROUSEL

Diagram sources

[src/_includes/layouts/base.njk:1-260](file://src/_includes/layouts/base.njk#L1-L260)
[src/_includes/layouts/iaa-base.njk:1-99](file://src/_includes/layouts/iaa-base.njk#L1-L99)

Section sources

[src/_includes/layouts/base.njk:1-260](file://src/_includes/layouts/base.njk#L1-L260)
[src/_includes/layouts/iaa-base.njk:1-99](file://src/_includes/layouts/iaa-base.njk#L1-L99)

Dependency Analysis

The platform maintains clear dependency boundaries between static and dynamic components:

graph TB
subgraph "Development Dependencies"
ELEVENTY["@11ty/eleventy"]
PAGEFIND["pagefind"]
WRANGLER["wrangler"]
TYPESCRIPT["typescript"]
end
subgraph "Runtime Dependencies"
HTMLMIN["html-minifier-terser"]
SHARP["sharp"]
TINACMS["tinacms"]
end
subgraph "Platform Dependencies"
CF_WORKERS["Cloudflare Workers"]
CF_KV["Cloudflare KV"]
RESSEND["Resend API"]
GOOGLE_SHEETS["Google Sheets API"]
end
subgraph "Build Process"
ELEVENTY --> PAGEFIND
PAGEFIND --> CF_WORKERS
WRANGLER --> CF_WORKERS
end
subgraph "Runtime Process"
CF_WORKERS --> CF_KV
CF_WORKERS --> RESSEND
CF_WORKERS --> GOOGLE_SHEETS
end

Diagram sources

[package.json:14-31](file://package.json#L14-L31)
[README.md:33-44](file://README.md#L33-L44)

Section sources

[package.json:1-32](file://package.json#L1-L32)
[README.md:33-44](file://README.md#L33-L44)

Performance Considerations

The platform is optimized for speed and efficiency through several mechanisms:

Static Delivery Optimization

Pre-rendered content: All public pages generated at build time
Asset optimization: CSS and JavaScript minification in production
Image processing: Sharp library for efficient image transformations
CDN distribution: Cloudflare's global edge network

Serverless Efficiency

Cold start mitigation: Minimal initialization overhead
Edge computing: Geographic proximity to users
Resource pooling: Shared runtime across requests
Automatic scaling: Seamless handling of traffic spikes

Search Performance

Client-side indexing: Pre-built search index reduces server load
Lazy loading: Pagefind engine loaded only when needed
Debounced queries: Reduced API calls during typing
Result caching: Intelligent caching of search results

Troubleshooting Guide

Authentication Issues

Common problems and solutions:

Member login failures: Verify email is registered in MEMBER_EMAILS KV namespace
Magic link not received: Check Resend API key configuration and email deliverability
Session expiration: Confirm SESSION_SECRET is properly set and consistent
Token validation errors: Ensure MAGIC_TOKENS KV namespace is configured

Build and Deployment

Pagefind not available: Verify Pagefind installation and build process
Static assets missing: Check Cloudflare Assets binding configuration
Worker deployment failures: Review Wrangler configuration and secrets
CMS authentication issues: Validate GitHub OAuth settings and permissions

Content Management

CMS not loading: Verify GitHub repository access and branch configuration
Media upload failures: Check file size limits and supported formats
Content validation errors: Review YAML frontmatter structure and required fields
Preview not updating: Confirm automatic rebuild triggers are functioning

Section sources

[README.md:497-521](file://README.md#L497-L521)
[README.md:523-587](file://README.md#L523-L587)
[README.md:656-665](file://README.md#L656-L665)

Conclusion

Ace Strategies Prime represents a modern, secure, and scalable approach to digital platform development. The hybrid architecture successfully balances performance, security, and flexibility while maintaining simplicity in both development and maintenance.

Key strengths include:

Performance-first design: Static generation with intelligent caching
Security by design: Magic link authentication and secure session management
Content flexibility: Git-backed CMS with structured content management
Developer experience: Clear separation of concerns and automated workflows
Scalability: Cloudflare's edge computing infrastructure

The platform serves as an excellent example of how modern web technologies can be combined to create robust, maintainable, and user-friendly digital experiences for both public and member-only audiences.

Project Overview

Table of Contents

Introduction

Project Structure

Core Components

Static Site Generation (Eleventy)

Serverless Runtime (Cloudflare Worker)

Content Management (Sveltia CMS)

Search Infrastructure (Pagefind)

Architecture Overview

Detailed Component Analysis

Member Authentication System

Content Management Workflow

Interactive Features and Components

Carousel System

Search Functionality

Layout Templates and Theming

Dependency Analysis

Performance Considerations

Static Delivery Optimization

Serverless Efficiency

Search Performance

Troubleshooting Guide

Authentication Issues

Build and Deployment

Content Management

Conclusion